<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head lang="en">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="format-detection" content="email=no"/>
    <meta charset="UTF-8">
    <script type="text/javascript" th:src="@{${session.baseUrl}+'js/common.js'}"></script>
    <script th:src="@{${session.baseUrl}+'js/jquery.js'}"></script>
    <link th:href="@{${session.baseUrl}+'style/reset.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/base.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/header.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/dialog.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/global.css'}" rel="stylesheet" type="text/css">
    <script th:src="@{${session.baseUrl}+'js/dialog.js'}"></script>
    <script th:src="@{${session.baseUrl}+'js/dialogbutton.js'}"></script>
    <link rel="stylesheet" th:href="@{${session.baseUrl}+'style/projectDetail.css'}"/>
    <title>转让详情</title>
    <style>
        .btn-block {
            position: fixed;

            height: 6%;
            width: 100%;
            bottom: 0.0rem;
            background-color: #2888e5;
            font-size: 0.32rem;
            color: #fff;
            border-radius: 0.1rem;
            align-items: center;

        }

        .header {
            position: fixed;
            width: 100%;
            z-index: 99;
            text-align: center;
            line-height: 0.88rem;
            height: 0.88rem;
            font-size: 0.32rem;
            color: #fff;
            background: #2d9cff;
            top: 0;
        }
        .btn-block1{
            position: fixed;
            height: 6%;
            width: 100%;
            bottom: 0.0rem;
            background-color: #888888;
            font-size: 0.32rem;
            color: #575757;
            border-radius: 0.1rem;
            align-items: center;
        }
        #pmsg{
            line-height: 0.3rem;
            font-size: 0.9rem;
            margin-left: 3.4rem;
            padding-bottom: 0.3rem;

        }

    </style>
</head>
<body>
<header class="header"><span onclick="javascript:history.go(-1)"></span>转让详情</header>

<input id="projectId" type="hidden" th:value="${drafts.id}">
<input type="hidden" th:value="${drafts.status}">
<input id="memberId" type="hidden" th:value="${session.memberId}">

<i th:if="${drafts.type==0}"><img th:src="@{${session.baseUrl}+'images/projectDetail/mingxing.png'}" alt="" style="width: 100%;height: 3.8rem;"/></i>
<i th:if="${drafts.type==1}"><img th:src="@{${session.baseUrl}+'images/projectDetail/youxiu.png'}" alt="" style="width: 100%;height: 3.8rem;"/></i>
<i th:if="${drafts.type==2}"><img th:src="@{${session.baseUrl}+'images/projectDetail/xingjiabi.png'}" alt="" style="width: 100%;height: 3.8rem;"/></i>
<i class="f30 title" th:text="${drafts.name}"></i>
<p>&nbsp;</p>
<ul id="intro">
    <li class="df jcsb pt30 lh50"><b>转让金额</b><b th:text="${memberProjectTransfer.transferAmount}"></b></li>
    <li class="df jcsb pt30 lh50"><b>年化收益率</b><span style="font-size: 0.4rem;color: red;font-weight: bold" th:text="${#numbers.formatDecimal(100*drafts.rate,1,2)}+'%'"></span></li>
    <li class="df jcsb pt30 lh50"><b>认购时间</b><b th:text="${#dates.format(memberProjectTransfer.createTime,'yyyy-MM-dd HH:mm:ss')}"></b></li>
    <li th:if="${memberProjectTransfer.endTime!=null}" class="df jcsb pt30 lh50"><b>结束时间</b><b th:text="${#dates.format(memberProjectTransfer.endTime,'yyyy-MM-dd HH:mm:ss')}"></b></li>
    <li th:if="${memberProjectTransfer.endTime =null}" type="hidden"><b>结束时间</b><b th:text="${#dates.format(memberProjectTransfer.endTime,'yyyy-MM-dd HH:mm:ss')}"></b></li>
    <li th:if="${memberProjectTransfer.acceptNumberName!=null}" class="df jcsb pt30 lh50"><b>接手人</b><b th:text="${memberProjectTransfer.acceptNumberName}"></b></li>
    <li th:if="${memberProjectTransfer.acceptNumberName =null}"><b>接手人</b><b th:text="${memberProjectTransfer.acceptNumberName}"></b></li>
</ul>

<ul class="detail">
    <li>详情介绍</li>
</ul>
<ul class="pb20" style="border-bottom: 0.2rem solid #f2f2f2;" >
    <li>
        <div style="width: 2.5rem;height: 1rem;margin-left: 1rem;" th:if="${drafts.imgOne!=null}">
            <img class="exampleImg" th:src="${drafts.imgOne}" id="imgTest1" style="height: 100%;width: 100%"/>
        </div>
        <div style="width: 2.5rem;height: 1rem;margin-left: 4rem;margin-top: -1rem" th:if="${drafts.imgTwo!=null&&drafts.imgOne!=null}">
            <img class="exampleImg" th:src="${drafts.imgTwo}" id="imgTest2" style="height: 100%;width: 100%"/>
        </div>
        <div style="width: 2.5rem;height: 1rem;margin-left: 2.5rem;" th:if="${drafts.imgTwo!=null&&drafts.imgOne==null}">
            <img class="exampleImg" th:src="${drafts.imgTwo}" id="imgTest3" style="height: 100%;width: 100%"/>
        </div>
    </li>
    <li class="df pl30 pr30 pt30 pb30" th:text="${drafts.projectIntro}">

    </li>
</ul>

<ul class="detail">
    <li>收益介绍</li>
</ul>
<ul class="pb20" style="border-bottom: 0.2rem solid #f2f2f2;" >
    <li class="df pl30 pr30 pt30 pb30" th:text="${drafts.projectEarningsIntrox}">

    </li>
</ul>

<ul class="detail">
    <li>风险介绍</li>
</ul>
<div class="pb20" style="border-bottom: 0.2rem solid #f2f2f2;" >
    <div class=" pl30 pr30 pt30 pb30" th:text="${drafts.projectRisk}">
    </div>
</div>

</body>
<footer>
    <span th:if="${memberProjectTransfer.status==0}">
            <button type="button" class="btn-block" onclick="quxiao()" style="z-index:9999;">转让中（点击取消）</button>
    </span>
    <span th:if="${memberProjectTransfer.status==1}">
       <button type="button" class="btn-block1" disabled="disabled"  style="z-index:9999;" >转让成功</button>
    </span>
    <span th:if="${memberProjectTransfer.status==2}">
        <button type="button" class="btn-block1" disabled="disabled"  style="z-index:9999;" >转让失败</button>
    </span>
    <span th:if="${memberProjectTransfer.status==3}">
        <button type="button" class="btn-block1" disabled="disabled"  style="z-index:9999;" >已取消</button>
    </span>
</footer>
<script type="text/javascript" th:inline="javascript">
    var basePath = /*[[${#httpServletRequest.getScheme() + "://" + #httpServletRequest.getServerName() + ":" + #httpServletRequest.getServerPort() + #httpServletRequest.getContextPath()}]]*/;




    function quxiao() {
        var memberId = $("#memberId").val();
        if (memberId == null || memberId == '') {
            $('body').dailog({type: 'warning', title: '未登录', discription: '请您先登录'});
            self.setInterval(function () {
                location.reload();
            }, 3000) //这里3000代表3秒
        } else {
            $('body').dailogbutton({type: 'success', title: '取消', discription: '是否确认取消？'},function(ret) {
                if (ret.index === 0) {
                    $.ajax({
                        url: basePath + "/wap/memberProjectTransfer.html/myTransfer1",
                        contentType: 'application/json',
                        type: "get",
                        dataType: "json",
                        data: {
                            id: [[${memberProjectTransfer.id}]],
                        },
                        success: function (e) {
                            if (e.data) {
                                $('body').dailog({type: 'success', title: '', discription: '取消成功'});
                                self.setInterval(function () {
                                    location.reload();
                                }, 3000)
                            } else {
                                $('body').dailog({type: 'warning', title: '', discription: '取消失败'});
                                self.setInterval(function () {
                                    location.reload();
                                }, 3000) //这里3000代表3秒
                            }
                        }
                    })


                } else {
                    location.reload();
                }


            })
        }
    }

</script>
</html>